<template>
  <div id="app">
    
  
    <h1>根组件{{name}}</h1>
    <h1>根组件{{this.$store.state.user.name}}</h1>

     <button @click="change">改名</button>
    <!-- <input @input="change" type="text" :value="$store.state.count"> -->
    <input type="text" >

   
  </div>
</template>

<script>
import { mapState } from 'vuex'

export default {
  name: 'app',
  data: function () {
    return {
      
    }
  },
 methods:{
   change(){
     
     this.$store.commit('user/setName', '马经理')
   }
  },
  computed:{
     ...mapState('user',['name'])

  }
 
}
</script>

<style>
#app {
  width: 600px;
  margin: 20px auto;
  border: 3px solid #ccc;
  border-radius: 3px;
  padding: 10px;
}
</style>